<template>
    <view>
        <u-tabbar :value="current?current:0" @change="changeTab" :fixed="true" :placeholder="false"
            :safeAreaInsetBottom="true" :border="false" :activeColor="themeColor">
            <u-tabbar-item v-for="(item,index) in list" :key="index" :text="item.text" class="custom-tabbar-text">				
                <image class="u-page__item__slot-icon chs"  slot="active-icon" :src="item.iconPath"></image>
                <image class="u-page__item__slot-icon chs"  slot="inactive-icon" :src="item.selectedIconPath"></image>				
            </u-tabbar-item>
        </u-tabbar>
    </view>
</template>

<script>
    export default {
        name: 'tabar',
        props: {
            current: Number
        },
        data() {
            return {
				themeColor:"#000",
                list: [{
                        iconPath: "../../static/tabs/home_selected.png",
                        selectedIconPath: "../../static/tabs/home_unselected.png",
                        text: '数据',
                        customIcon: false,
                        pagePath: "pages/home/index"
                    },
                    {
                        iconPath: "../../static/tabs/classify_selected.png",
                        selectedIconPath: "../../static/tabs/classify_unselected.png",
                        text: '测量',
                        customIcon: false,
                        pagePath: "pages/class/index"
                    },
					
					{
						iconPath: "../../static/tabs/shop_selected.png",
						selectedIconPath: "../../static/tabs/shop_unselected.png",
						text: '打卡',
						customIcon: false,
						pagePath: "pages/clock/index"
					},
					{
						iconPath: "../../static/tabs/mine_selected1.png",
						selectedIconPath: "../../static/tabs/mine_unselected1.png",
						text: '我的',
						customIcon: false,
						pagePath: "pages/mine/index"
					}
                ],
            }
        },
        methods: {
            changeTab(e) {
                console.log(e)
                uni.switchTab({
                    url: '/' + this.list[e].pagePath,
                })
            }
        }
    }
</script>

<style scoped>
	.tabbar-content-row {
	  display: flex;
	  flex-direction: row;
	  align-items: center;
	  gap: 6rpx;
	}
	.chs{
			margin-top: 36rpx;
		width: 52rpx;
		height: 52rpx;
	}
    .middel {
		margin-top: 26rpx;
      width: 115rpx;
      height: 115rpx;
    }
	
	/deep/ .u-tabbar-item .u-icon-text {
	  color: #ff0000 !important; /* 红色字体 */
	}
	.custom-tabbar-text {
	  color: #000 !important; /* 蓝色字体 */
	}
</style>